<template>
  <div>
    <CategorySelector :disabled="isShowList !== 0" />
    <!--
      v-bind:xxx.sync
        即传递数据，也传递更新数据的方法

      :isShowSpuList="isShowSpuList"  会给组件只会传递一个 isShowSpuList 属性
      :isShowSpuList.sync="isShowSpuList"
        即会给组件传递一个 isShowSpuList 属性
        也会给组件传递一个 更新 isShowSpuList 属性的自定义事件 @update:isShowSpuList
          注意方法父组件不需要定义
     -->
    <SpuList :is-show-list.sync="isShowList" />
    <AddOrUpdateSpu :is-show-list.sync="isShowList" />
    <AddSku :is-show-list.sync="isShowList" />
    <SkuList />
  </div>
</template>

<script>
import SpuList from './SpuList'
import AddOrUpdateSpu from './AddOrUpdateSpu'
import AddSku from './AddSku'
import SkuList from './SkuList'

export default {
  name: 'Spu',
  components: {
    SpuList,
    AddOrUpdateSpu,
    AddSku,
    SkuList
  },
  data() {
    return {
      isShowList: 0 // 0: 代表显示SpuList 1：代表显示AddOrUpdateSpu 2：代表显示AddSku
      // isShowSpuList: true,
      // isShowAddSku: false,
    }
  }
}
</script>

<style lang="less" scoped>
</style>
